<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    #include("common/header.html")
    <link type="text/css" rel="stylesheet" href="/css/login.css"/>
    <title></title>
</head>
<body>
<header style="background: #005aab;" class="mui-bar mui-bar-nav head">
    <!--<span class="mui-icon mui-icon-back"></span>-->
    <h1 style="color: #FFFFFF; letter-spacing: 4px;" class="mui-title">登录</h1>
    <!--<span class="mui-icon mui-icon-more"></span>-->
</header>
<div class="mui-content">
    <h1 style="font-size:22px;text-align:center;margin-top:30px;">中国建设银行信用卡辅助系统</h1>
    <form class="mui-input-group" style="margin-top:50px;">
        <div class="mui-input-row">
            <label>
                <span style="color: #898989; font-size: 24px;" class="mui-icon iconfont icon-ren2"></span>
            </label>
            <input type="text" id="mobile" class="mui-input-clear" placeholder="手机号码">
        </div>
        <div class="mui-input-row">
            <label>
                <span style="color: #898989; font-size: 24px;" class="mui-icon iconfont icon-lock-fill-copy"></span>
            </label>
            <input type="password" id="password" placeholder="请输入密码">
        </div>
        <div class="login_seting">
            <span>登录遇到问题</span>
        </div>
        <div style="margin-top: 12px;" class="mui-button-row">
            <button type="button" class="mui-btn mui-btn-primary" onclick="login()">登录</button>
        </div>
        <div class="login_seting">
            <span><a href="/v/reg">立即注册</a></span>
        </div>
    </form>
</div>
</body>
<script>
    mui.init();

    function login() {

        var mobile = $.trim($("#mobile").val());
        var password = $.trim($("#password").val());

        if(mobile == null || mobile == "" || password == null || password == "" ){
            mui.toast('用户名或密码不能为空!');
            return;
        }

        mui.ajax('/v/login', {
            data: {
                mobile : mobile,
                password : password
            },
            dataType: 'json',//服务器返回json格式数据
            type: 'post',//HTTP请求类型
            timeout: 10000,//超时时间设置为10秒；
            success: function (data) {
                //服务器返回响应，根据响应结果，分析是否登录成功；
                console.log(data);
                if(data.code == -1){
                    mui.toast('用户名或密码错误!');
                    return;
                }

                mui.toast('登录成功!');

                mui.openWindow({
                    url: '/business/',
                    id:'/business/'
                });
            },
            error: function (xhr, type, errorThrown) {
                //异常处理；
                console.log(type);
                mui.toast('请求异常,请稍后重试!');
            }
        });
    }

</script>
</html>
